<!-- FileLabel

  event:

    + 'close'

-->

<template>
  <div v-if="filename != null" class="file-label">
    <el-tag
      effect="dark"
      size="medium"
      disable-transitions
      :type="type"
      :closable="closable"
      @close="onClose"
    >{{ filename }}</el-tag>
  </div>
</template>

<script>
export default {
  name: 'FileLabel',
  props: {
    tableData: {
      type: Object,
    },
    type: {
      type: String,
      default: '',
    },
    closable: {
      type: Boolean,
      default: true,
    },
  },
  computed: {
    filename() {
      if (this.tableData && (this.tableData.file != null)) {
        return this.tableData.file.name
      }
      return null
    },
  },
  methods: {
    onClose() {
      this.$emit('close')
    },
  },
}
</script>

<style scoped lang="scss">

</style>
